import React from 'react';
import {Form, Row, Select, Button,Input, message} from 'antd';
import {injectIntl} from 'react-intl';
import SCModal from '../../components/pickCity/SCModal';
import axios from 'axios';
import {sessionManager} from '../../utils/sessionStorage';

const Option=Select.Option;
const FormItem = Form.Item;
const createForm = Form.create;
class ModifyAcc extends React.Component {
    constructor(props) {
        super(props);
        this.state={
            isPersonal:true,
            roleList:[],
            isModal:false,
            info:{}
        };
        this.common = this.props.intl.messages.common;
    }

    componentWillReceiveProps(nextProps) {
        //修改入口
        if(nextProps.visible&&nextProps.isModal&&nextProps.canGetApi){
            axios.post('/api/corp/global/get',{id:sessionManager.get('SubAccount').id}).then(res=>{
                if(res){
                    nextProps.getApi();
                    this.setState({
                        isModal:true,
                        info:res.data,
                    })
                    if(res.data.type==0){
                        this.setState({
                            isPersonal:true
                        })
                    }
                    if(res.data.type==1){
                        this.setState({
                            isPersonal:false
                        })
                    }
                }
            })
        }
        if(nextProps.visible&&!nextProps.isModal){
            this.setState({
                info:{},
                isModal:false,
            })
        }
    }
    
    /*----------登陆表单处理--------------*/
    validatePhone = (rule, value, callback) => {
        let myreg = /^1[3|4|5|7|8|9][0-9]{9}$/;
        if (value && !myreg.test(value)) {
            callback('登录帐号必须为手机号');
        } else {
            callback();
        }
    };
    validatePhone2 = (rule, value, callback) => {
        let myreg = /^1[3|4|5|7|8|9][0-9]{9}$/;
        if (value && !myreg.test(value)) {
            callback('请输入正确的手机号');
        } else {
            callback();
        }
    };

    validateCode = (rule, value, callback) => {
        let myreg = /^\d{9}$/;
        let myreg2=/^[A-Z]+$/;
        if (value && !myreg.test(value) && !myreg2.test(value)) {
            callback('请输入正确组织机构代码');
        } else {
            callback();
        }
    };

    validateID=(rule, value, callback) => {
        let myreg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
        if (value && !myreg.test(value)) {
            callback('请输入正确的身份证号');
        } else {
            callback();
        }
    };

    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFieldsAndScroll((errors, values) => {
            if (!!errors) {
                console.log('Errors in form!!!',values);
                return;
            }
            console.log(values);
            values.id=this.state.info.id;
            if(!this.state.isModal){
                values.billUserId=this.props.stack[this.props.stack.length-1]
            }
            axios.post('/api/corp/mod',values).then(res=>{
                if(res){
                    message.success('操作成功');
                    this.props.freshTable();
                    this.props.onCancel();
                }
            })
        });
    };

    validateOrg=(rule, value, callback) => {
        let myreg = /^[A-Z0-9]{9,9}$/;
        if (value && !myreg.test(value)) {
            callback('请输入正确的组织机构代码');
        } else {
            callback();
        }
    };

    handleChange = (value) => {
        if(value==='0'){
            this.setState({
                isPersonal:true
            },()=>{
                this.props.form.validateFields(['idNo'], { force: true });
            })
        }
        if(value==='1'){
            this.setState({
                isPersonal:false
            },()=>{
                this.props.form.validateFields(['idNo'], { force: true });
            })
        }
    };

    render(){
        const formItemLayout = {
            labelCol: {
                xl: {span: 7},
                xxl: {span: 7}
            },
            wrapperCol: {
                xl: {span: 17},
                xxl: {span: 17}
            },
        };
        const formTailLayout = {
            labelCol: { span: 7 },
            wrapperCol: { span: 8, offset: 7 },
          };
        const { getFieldDecorator } = this.props.form;
        //
        const config = {
            rules: [
                {
                    required: true,
                    message: this.common.required
                }
            ]
        };
        return(
            <SCModal visible={this.props.visible} title={'新增/修改账户'}  onCancel={this.props.onCancel}>
                <form  form={this.props.form} style={{width:'60%'}}>
                    <Row>
                        {!this.state.isModal&&<FormItem
                        {...formItemLayout}
                            label={'登录帐号'}
                        >
                            {getFieldDecorator('account',{rules: [
                                {
                                    required: true,
                                    message: this.common.required
                                }, {
                                    validator: this.validatePhone
                                }
                                ],
                                initialValue:this.state.info.account})(
                                <Input />
                            )}
                        </FormItem>}
                        <FormItem
                        {...formItemLayout}
                            label={'类型'}
                        >
                            {getFieldDecorator('type',{...config,...{initialValue: this.state.info.type?this.state.info.type + '':undefined}})(
                                <Select optionLabelProp="children" optionFilterProp="children" onChange={this.handleChange}>
                                    <Option value={'0'} key={0}>个人</Option>
                                    <Option value={'1'} key={1}>企业</Option>
                                </Select>
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'联系人姓名'}
                        >
                            {getFieldDecorator('chiefName',{...config,...{initialValue:this.state.info.chiefName}})(
                                <Input />
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'联系人电话'}
                        >
                            {getFieldDecorator('chiefPhone',{
                                rules: [
                                    {
                                        required: true,
                                        message: this.common.required
                                    }, {
                                        validator: this.validatePhone2
                                    }
                                ],
                                initialValue:this.state.info.chiefPhone})(
                                <Input />
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'联系人身份证号码'}
                        >
                            {getFieldDecorator('idNo',{
                                rules:[
                                    {required: this.state.isPersonal, message: '该项为必填项'},
                                    {
                                        validator: this.validateID
                                    }
                                ],
                                initialValue:this.state.info.chiefIdn})(
                                <Input />
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'商户名称'}
                        >
                            {getFieldDecorator('name',{...config,...{initialValue:this.state.info.companyName}})(
                                <Input />
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'公司电话'}
                        >
                            {getFieldDecorator('companyPhone',{...{initialValue:this.state.info.companyPhone}})(
                                <Input />
                            )}
                        </FormItem>
                        {!this.state.isPersonal&&<FormItem
                        {...formItemLayout}
                            label={'组织机构代码'}
                        >
                            {getFieldDecorator('orgCode',{
                                rules:[
                                    {required: true, message: '该项为必填项'},
                                ],
                                initialValue:this.state.info.companyOrgCode})(
                                <Input placeholder={'9位数字或大写英文字母'}/>
                            )}
                        </FormItem>}
                        <FormItem
                        {...formItemLayout}
                            label={'公司地址'}
                        >
                            {getFieldDecorator('companyAddress',{...{initialValue:this.state.info.companyAddress}})(
                                <Input />
                            )}
                        </FormItem>
                        {/* <FormItem
                        {...formItemLayout}
                            label={'商户权限'}
                        >
                            {getFieldDecorator('role',{...config,...{initialValue:this.state.info.role}})(
                               <Select optionLabelProp="children" optionFilterProp="children">
                                {this.state.roleList.map((k,v)=>(
                                    <Option value={k.id} key={k.id}>{k.name}</Option>
                                ))}
                               </Select>
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'用户限制数'}
                        >
                            {getFieldDecorator('userCnt',{...config,...{initialValue:this.state.info.userCnt}})(
                                <Input />
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'发送短信'}
                        >
                            {getFieldDecorator('sendSms',{...config,...{initialValue:this.state.info.sendSms}})(
                                <Select optionLabelProp="children" optionFilterProp="children">
                                    <Option value={false} key={0}>否</Option>
                                    <Option value={true} key={1}>是</Option>
                                </Select>
                            )}
                        </FormItem>
                        <FormItem
                        {...formItemLayout}
                            label={'星卡权限'}
                        >
                            {getFieldDecorator('card',{...config,...{initialValue:this.state.info.card}})(
                                <Select optionLabelProp="children" optionFilterProp="children">
                                    <Option value={false} key={0}>否</Option>
                                    <Option value={true} key={1}>是</Option>
                                </Select>
                            )}
                        </FormItem> */}
                        <FormItem {...formTailLayout}>
                            <Button type="primary" htmlType="submit" onClick={this.handleSubmit}>{this.state.isModal?'确定修改':'确定添加'}</Button>
                        </FormItem>
                    </Row>
                </form>
            </SCModal>
        )
    }

}

ModifyAcc = createForm()(ModifyAcc);
export default injectIntl(ModifyAcc);